
<style>
html{
    background: #333;
}

a{
    color: #777;
}
    /* ------------------------------------------- */
ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
    /* ------------------------------------------- */

    /* ------------------------------------------- */
#breadcrumbs-four{
    /* Clear floats */
    overflow: hidden;
    width: 100%;
}
#breadcrumbs-four li{
    float: left;
    margin: 0 .5em 0 1em;
}
#breadcrumbs-four a{
    background: #ddd;
    padding: .7em 1em;
    float: left;
    text-decoration: none;
    color: #444;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
    position: relative;
}
#breadcrumbs-four a:hover{
    background: #efc9ab;
}
#breadcrumbs-four a::before,
#breadcrumbs-four a::after{
    content:'';
    position:absolute;
    top: 0;
    bottom: 0;
    width: 1em;
    background: #ddd;
    -webkit-transform: skew(-10deg);
    -moz-transform: skew(-10deg);
    -ms-transform: skew(-10deg);
    -o-transform: skew(-10deg);
    transform: skew(-10deg);
}
#breadcrumbs-four a::before{
    left: -.5em;
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}
#breadcrumbs-four a:hover::before{
    background: #efc9ab;
}
#breadcrumbs-four a::after{
    right: -.5em;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
#breadcrumbs-four a:hover::after{
    background: #efc9ab;
}
#breadcrumbs-four .current,
#breadcrumbs-four .current:hover{
    font-weight: bold;
    background: none;
}
#breadcrumbs-four .current::after,
#breadcrumbs-four .current::before{
    content: normal;
}
</style>


<ul id="breadcrumbs-four">
    <li><a href="{:U('friend/Info/basic')}">基本资料</a></li>
    <li><a href="{:U('friend/Info/education')}">教育经历</a></li>
    <li><a href="{:U('friend/Info/work')}">工作经历</a></li>
    <li><a href="{:U('friend/Info/friend_set')}">交友设置</a></li>

</ul>
